<template>
	<view class="become-partner-view">
		<view class="fx-center-between become-partner-top">
			<view class="">
				<view class="become-partner-title">提交合伙人申请</view>
				<view class="become-partner-desc">向轻钉轻创介绍您自己，审核通过后您将获得：</view>
				<view class="">· 强大的推广资源支持及收入增长</view>
				<view class="">· 共创共享的终生收益平台</view>
			</view>
			<image src="/static/partner_icon.png" mode="widthFix" class="become-partner-icon"></image>
		</view>
		<view class="become-partner-input">
			<van-field :value="name" @change="name = $event.detail" placeholder="请输入" input-align="right" clearable>
				<template slot="label">
					<label class="input-lable">您的姓名<text class="tip-score">*</text></label>
				</template>
			</van-field>
			<van-field :value="mobile" type="number" :maxlength="11" @change="mobile = $event.detail" placeholder="请输入"
				input-align="right" clearable>
				<template slot="label">
					<label class="input-lable">联系方式<text class="tip-score">*</text></label>
				</template>
			</van-field>
			<van-field :value="city" @change="city = $event.detail" placeholder="请输入" input-align="right" clearable>
				<template slot="label">
					<label class="input-lable">城市<text class="tip-score">*</text></label>
				</template>
			</van-field>

			<!-- <van-cell is-link value="请选择">
				<template slot="title">
					<label class="input-lable">城市<text class="tip-score">*</text></label>
				</template>
			</van-cell> -->
			<van-cell title="请简单介绍一下您" :border="false" />
			<view class="textarea-box main-basic-textarea">
				<textarea v-model="content" placeholder="请输入" maxlength="200"></textarea>
				<view class="num-tip">{{content.length}}/200</view>
			</view>
		</view>
		<view class="main-basic-btn">
			<van-button block color="#4078E5" @click="submit">提交</van-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				name: '',
				mobile: '',
				city: '',
				content: ''
			};
		},
		methods: {
			submit() {
				if (this.name.trim() === '') {
					this.$api.showError('姓名不能为空！')
					return
				}
				if (!this.$api.isValidPhone(this.mobile)) {
					this.$api.showError('请输入正确的联系方式！')
					return
				}
				if (this.city.trim() === '') {
					this.$api.showError('城市不能为空！')
					return
				}
				uni.showLoading({
					title: '数据提交中...'
				})
				this.$api
					.requst('/gwc/form/partners', {
						name: this.name,
						phone: this.mobile,
						city: this.city,
						body: this.content,
					}, 'POST')
					.then((res) => {
						this.$api.showError('提交成功！')
						setTimeout(() => {
							uni.navigateBack()
						}, 1000)

					})
			}
		}
	}
</script>

<style scoped lang="scss">
	.become-partner-view {
		padding-bottom: 300rpx;
		box-sizing: border-box;
		margin: 32rpx;
	}

	.become-partner-top {
		font-size: 26rpx;
		color: #5C5F66;

		.become-partner-title {
			font-weight: bold;
			font-size: 40rpx;
			color: #161616;
		}

		.become-partner-desc {
			color: #161616;
			margin: 16rpx 0 24rpx;
		}

		.become-partner-icon {
			width: 154rpx;
			height: 156rpx;
			flex-shrink: 0;
			margin-left: 68rpx;
		}
	}

	.become-partner-input {
		background: #FFFFFF;
		border-radius: 4rpx 4rpx 4rpx 4rpx;
		font-size: 30rpx;
		margin-top: 40rpx;
		padding-bottom: 32rpx;


		.tip-score {
			color: #FF3B51;
		}

		.textarea-box {
			margin: 0 32rpx 32rpx;
			padding: 24rpx;

			textarea {
				height: 200rpx;
			}
		}
	}

	::v-deep .van-cell {
		padding: 32rpx;
	}
</style>